import React, {Component} from 'react';
import $ from 'jquery'

class App4 extends Component {
    constructor(props) {
        super(props);
        this.state={
            mess:''
        }
    }
    render() {
        return (
            <div>
                {/*<button onClick={this.sendAjax}>click</button>*/}
                <button onClick={this.sendAjaxNormalFunc.bind(this)}>click</button>
                <p title={this.state.mess}>{this.state.mess}</p>
            </div>
        );
    }
    saySome(){
        alert('seyana')
    }
    sendAjaxNormalFunc(){
        //Pay more attention on this $this.
        //If use this rather than arrow function, must say this.funcName.bind(this).
        $.post(
            'http://localhost:8090/lg',
            {mess:'from ajax'},
            (data)=>{
                // alert(data);
                // this.state.mess=data;
                //XXXXXX

                this.setState({
                    //this $this is not the component $this
                    mess:data
                })

            }
        )
    }
    sendAjax=()=>{
        //pay more attention on this $this
        //arrow func does not have $this
        $.post(
            'http://localhost:8090/lg',
            {mess:'from ajax'},
            (data)=>{

                this.setState({
                    //this $this is not the component $this
                    mess:data
                })

            }
        )
    }


}

export default App4;